#main{
    margin:0;
    text-align: center;
    #score-panel{
        width:600px;
        margin:auto;
        text-align: left;
    }
}
#settings{
    width: 800px;
    height: 500px;
    background-color: beige;
    z-index: 99;
    position: absolute;
    left: calc((100vw - 800px)/2);
    top:0;
    padding: 100px 50px 0 50px;
    line-height: 30px;
    overflow: hidden;
    scroll-behavior: auto;

    &> span {
        display: inline-block;
        width:50%;
        text-align: right;
    }
    button{
        width:80px;
        margin-top: 5px;
        padding: 5px;
        margin-left: calc((100% - 80px)/2);
    }
}
.help{
    text-decoration: underline;
    color:blue;
    cursor: help;
}
.help:active {
    color:gray;
}
.tooltip{
    border: 0;
    border-radius: 5px;
    background-color: rgb(47, 47, 47);
    color: whitesmoke;
    text-align: left;
    line-height: 18px;
    font-size: 13px;
    width:200px;
    min-height: 20px;
    padding: 10px;
    display: none;
    position: absolute;
    z-index: 10;
    cursor:text;
    box-shadow: 2px 2px 5px #525252;
    span.triangle{
        display: inline-block;
        position: absolute;
        top:-10px;
        left:40%;
        z-index: 11;
        border-top: 0px solid transparent;
        border-right: 9px solid transparent;
        border-left: 9px solid transparent;
        border-bottom: 11px solid rgb(47, 47, 47);
        border-radius: 5px;
        height: 0;
        width: 0;
    }
}
.sign{
    text-align: center;
    color: gray;
    font-family: monospace;
}